<div id="contentContainer" data-ng-controller="ControllerUsers" data-ng-init="updateList()">
    <div data-ng-if="enableAddUser">
    <h2>Crear {{role}}</h2>

    <form id="quickAddUser" name="addUserForm" method="post" data-ng-submit="addUser()" class="clearfix">
        <label for="quName">Nombre</label>
        <input id="quName" type="text" name="userName" data-ng-model="user.name" required/>
        <label for="quLastName">Apellidos</label>
        <input id="quLastName" type="text" name="userLastName" data-ng-model="user.lastname" required/>
        <label for="quUsername">Nombre de usuario</label>
        <input id="quUsername" type="text" name="userName" data-ng-model="user.username" required/>
        <label for="quSecretword">Contraseña</label>
        <input id="quSecretword" type="password" name="userPassword" data-ng-model="user.secretword" required/>
        <button type="submit" class="right">Agregar</button>
    </form>
    {{message}}<br/>
    </div>
    <h2>Lista de {{role}}</h2>

    <form>
        <label>Mostrar</label>
        <select name="listStatus"
                data-ng-model="listStatus"
                data-ng-options="status.name for status in selectStatus"
                data-ng-init="listStatus=selectStatus[0]"
                data-ng-change="updateList()">
        </select>
        <label>Nombre del {{role}}</label>
        <input type="text" data-ng-model="fieldUser" ng-change="predictUser()" />
    </form>
    <ul class="grid">
        <li data-ng-repeat="user in users" class="cols-10">
            <a href="/usuario/{{user.id}}" class="clearfix">
                    <img src="/styles/images/avatar/{{user.avatar[0].id}}.png" />
                    {{user.name}} {{user.lastname }}
            </a>
        </li>
    </ul>
</div>